WPF属性绑定实现双向变化 您所在的位置:网站首页 wpf 自定义控件 绑定属性 WPF属性绑定实现双向变化

WPF属性绑定实现双向变化

2024-07-16 21:06| 来源: 网络整理| 查看: 265

  WPF依赖项属性可以实现属性的绑定,成功绑定之后只要修改后台绑定的属性,即可UI同步自动更新绑定的值,无需手动刷新界面;同样,前台的值变化后,通过获取绑定的属性值也可获取UI变化后的值,实现双向变化的效果。属性绑定使得UI更新非常的方便,下面分享一个小栗子说明使用的方式。

1、先做了一个有一个TextBlock和一个Button的UI,想要实现点击后TextBlock发生变化。

OK

 

2、创建UI更新类(现在是测试,所以属性比较少,正常开发建议一个UI创建一个UI更新类专门用于UI更新),如下为完整代码

public class PropertyToUI : INotifyPropertyChanged { #region 私有变量 /// /// 状态栏显示文本 /// private string text = ""; #endregion #region 属性 /// /// 属性-显示文本 /// public string Text { get { return text; } set { text = value; OnPropertyChanged("Text"); } } #endregion #region 属性变化通知事件 /// /// 属性变化通知事件 /// public event PropertyChangedEventHandler PropertyChanged; /// /// 属性变化通知 /// /// public void OnPropertyChanged(PropertyChangedEventArgs e) { if (PropertyChanged != null) { PropertyChanged(this, e); } } /// /// 属性变化通知事件 /// /// public void OnPropertyChanged(string PropertyName) { PropertyChangedEventArgs e = new PropertyChangedEventArgs(PropertyName); if (PropertyChanged != null) { PropertyChanged(this, e); } } #endregion }

这个部分有如下几个关键点:

(1)、需要实现INotifyPropertyChanged接口,这是一个属性更新接口,可以看一下它的实现,有一个属性更新事件,所以要说声明该事件。

namespace System.ComponentModel { // // 摘要: // Notifies clients that a property value has changed. public interface INotifyPropertyChanged { // // 摘要: // Occurs when a property value changes. event PropertyChangedEventHandler PropertyChanged; } }

(2)、创建属性更新函数

     /// /// 属性变化通知 /// /// public void OnPropertyChanged(PropertyChangedEventArgs e) { if (PropertyChanged != null) { PropertyChanged(this, e); } }

参数为某个属性的更新事件,而后触发PropertyChanged(this, e)通知UI更新指定属性

(3)、包装属性

    public string Text { get { return text; } set { text = value; OnPropertyChanged("Text"); } }

在设置器中调用属性更新事件,即当后台设置值时(想要更新UI值),就会触发属性更新事件,通知前台绑定的依赖项属性进行更新(事件中带有属性的身份标识和值进行传递)。

 

3、前台依赖项属性对属性更新类中的属性进行绑定(Binding语法)

属性名绑定即可

 

4、绑定数据源的说明(这是比较容易忘记的地方)

PropertyToUI UI = new PropertyToUI(); this.DataContext = UI; //事件绑定数据源

以上就是属性绑定的必要步骤了,如果没什么问题基本就成功了,没成功的再好好检查一下。

 

如下为完整的后台代码:

/// /// Window1.xaml 的交互逻辑 /// public partial class Window1 : Window { /// /// UI更新类对象 /// PropertyToUI UI = new PropertyToUI(); /// /// 构造函数 /// public Window1() { InitializeComponent(); this.DataContext = UI; //事件绑定数据源 UI.Text = "程序开启"; } /// /// OK按键点击事件 /// /// /// private void Button_OK_Click(object sender, RoutedEventArgs e) { UI.Text = "我更新了"; MessageBox.Show(UI.Text); } }

 

运行效果如下:

 

点击OK按键后:

 



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有